<template>
  <div>
    <el-form ref="dataForm" :model="dataForm" :rules="rules" label-width="140px" size="small">
<!--      <el-form-item label="提现日期类型" prop="type">-->
<!--        <el-radio-group v-model="dataForm.type" size="small">-->
<!--          <div>-->
<!--            <el-radio :label="1" prop="value">-->
<!--              <el-radio-group :disabled="dataForm.type===1?false:true" v-model="dataForm.value" size="small">-->
<!--                <el-radio-button :label="1">每周一</el-radio-button>-->
<!--                <el-radio-button :label="2">每周二</el-radio-button>-->
<!--                <el-radio-button :label="3">每周三</el-radio-button>-->
<!--                <el-radio-button :label="4">每周四</el-radio-button>-->
<!--                <el-radio-button :label="5">每周五</el-radio-button>-->
<!--                <el-radio-button :label="6">每周六</el-radio-button>-->
<!--                <el-radio-button :label="7">每周日</el-radio-button>-->
<!--              </el-radio-group>-->
<!--            </el-radio>-->
<!--          </div>-->
<!--          <div style="margin-top: 20px">-->
<!--            <el-radio :label="2" prop="value">-->
<!--              每月-->
<!--              <el-input v-model="dataForm.value" maxlength="2" :disabled="dataForm.type===2?false:true"-->
<!--                        style="width: 50px" size="small"></el-input>-->
<!--              日-->
<!--            </el-radio>-->
<!--          </div>-->
<!--        </el-radio-group>-->
<!--      </el-form-item>-->
      <el-form-item label="佣金结算方式" prop="drawType" size="small">
        <el-radio-group v-model="dataForm.drawType">
          <el-radio :label="1">比例</el-radio>
          <el-radio :label="2">固定金额</el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item v-if="dataForm.drawType === 1" label="比例" prop="ratio">
        <el-input type="number" v-model="dataForm.ratio" style="width: 200px" placeholder="" size="small">
          <template slot="append">%</template>
        </el-input>
      </el-form-item>
      <el-form-item v-if="dataForm.drawType === 2" label="金额" prop="ratio">
        <el-input type="number" v-model="dataForm.ratio" style="width: 200px" placeholder="" size="small">
          <template slot="append">¥</template>
        </el-input>
      </el-form-item>
      <el-form-item label="单笔最低提现额度" prop="minDraw">
        <el-input type="number" v-model="dataForm.minDraw" style="width: 200px" placeholder="单笔最低限额" size="small">
          <template slot="append">¥</template>
        </el-input>
      </el-form-item>
      <el-form-item label="每日最高提现额度" prop="maxDraw">
        <el-input type="number" v-model="dataForm.maxDraw" style="width: 200px" placeholder="每日最高限额" size="small">
          <template slot="append">¥</template>
        </el-input>
      </el-form-item>
      <el-form-item label="自动结算天数" prop="confirmDay">
        <el-input v-model="dataForm.confirmDay" style="width: 200px;" type="number" size="small">
        </el-input>
        <div style="line-height: 24px;margin-top: 6px;">
          注：当订单支付完成n天后，该订单自动进行结算，如果设置为0天 则订单完成时就结算</br>
          建议自动结算天数大于允许发起售后申请天数，如果用户申请退款退货 则不进行结算
        </div>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="onSubmit" :loading="loading">保存</el-button>
        <el-button @click="handleCancel" v-if="id">放弃修改</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
  import {getObj, addObj} from '@/api/delivery/config'

  export default {
    name: 'config',
    data() {
      return {
        dataForm: {
          value: 1,
        },
        id: '',
        shopId: '',
        loading: false,
        rules: {
          type: [
            {required: true, message: '请选择提现日期类型', trigger: 'change'}
          ],
          value: [
            {required: true, message: '请选择/填写提现日期', trigger: 'change'}
          ],
          drawType: [
            {required: true, message: '请选择提现类型', trigger: 'change'}
          ],
          ratio: [
            {required: true, message: '', trigger: 'blur'}
          ],
          minDraw: [
            {required: true, message: '请填写单笔最低提现额度', trigger: 'blur'}
          ],
          maxDraw: [
            {required: true, message: '请填写每日最高提现额度', trigger: 'blur'}
          ],
          confirmDay: [
            {required: true, message: '请填写自动结算天数', trigger: 'blur'}
          ]
        }
      }
    },
    methods: {
      getList(id) {
        this.shopId = id
        this.id = this.$store.state.user.shopId
        getObj(id).then(response => {
          if (response.data.data) {
            this.dataForm = response.data.data
          } else {
            this.dataForm = {}
          }
        })
      },
      /**
       * @title 数据添加
       * @param row 为当前的数据
       * @param done 为表单关闭函数
       *
       **/
      onSubmit() {
        this.loading = true
        const data = new FormData()
        var _this = this
        data.append('shopId', this.shopId)
        data.append('confirmDay', this.dataForm.confirmDay)
        data.append('drawType', this.dataForm.drawType)
        data.append('maxDraw', this.dataForm.maxDraw)
        data.append('minDraw', this.dataForm.minDraw)
        data.append('ratio', this.dataForm.ratio)
        data.append('type', this.dataForm.type)
        data.append('value', this.dataForm.value)
        addObj(data).then(res => {
          this.loading = false
          this.$message({
            showClose: true,
            message: '保存成功',
            type: 'success'
          })
          this.getList(_this.shopId)
          this.$emit('handlerDisableDialog', '')
        })
      },
      handleCancel() {
        this.loading = false
        this.getList(this.shopId)
      },
      /**
       * 刷新回调
       */
      // refreshChange() {
      //  this.getList(1)
      // }
    }
  }
</script>
